﻿<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <style>
        .name{
            margin:100px auto;
            width:200px;
            height:20px;
           /* background:#0094ff;*/
            text-align:center;
            font-size:50px;

        }
        .st{
            margin-left:425px;
        }
    </style>
</head>
<body>
    <div>
        <div class="name"></div>
        <!--<button onclick="run()" class="st">开始</button>
        <button onclick="stop()"> 结束</button>-->
    </div>
    <script>
        var str = `1, 2, 3, 4, 5, 6`;
        var arr = str.split(`,`);
        var div = document.querySelector(`.name`);
        let time;
        let run = function () {
            time = setInterval(function () {
                var i = Math.floor(Math.random() * arr.length);
                div.innerHTML = arr[i];
            },10)
        }
        let stop = function () {
            clearInterval(time);
        }
        window.onkeydown = function (e) {
            console.log(e.keyCode);
            if (e.keyCode==32) {
                run();
                setTimeout(stop, 1000);
            } 
        }
       
    </script>
</body>
</html>